<div class="page-content card-content">

 <style type="text/css">
.card-content .item{ background: #fff; padding: 15px; margin: 20px; text-align: center}
img{max-width: 100%;}
.card-content .item .logo{  margin-top: -30px ; min-height: 50px }
.card-content .item .logo img{ width: 50px;  }
.card-content. .item .title{ font-size: 54rpx; text-align: center}
.card-content .item .btn{ width: 40%; margin-top: 20px; }
.card-content  .item .info{ margin-top: 15px; line-height: 20px }
.card-content   .bfix{ position: fixed; bottom: 0px; left: 0 ;    height: 40px;line-height: 40px;padding: 0px;}
</style>

<div id="component_card_content">
<div class="tab">
   <div   v-on:click='setStatus("")'  :class="status===''?'tabli on':'tabli'"><span>全部</span></div>
   <div   v-on:click='setStatus(0)'   :class="status===0?'tabli on':'tabli'"><span>可使用</span></div>
   <div  v-on:click='setStatus(1)'  :class="status==1?'tabli on':'tabli'"><span>已使用</span></div>
   <div   v-on:click='setStatus(2)'   :class="status==2?'tabli on':'tabli'"><span>过期</span></div>
</div>


 <section class="errormsgDiv"   v-if="nodata">
    <p class="errormsg">\（￣︶￣）/</p>
    <p class="errormsg2">没有查到优惠券</p>
 </section>


<section v-else> 
	<div class="item"    v-for="cardInfo in items" v-if="cardInfo.config && cardInfo.config.base_info" >
		    <div class="logo"><img :src="cardInfo.store.logo"></div>
		    <div class='light'>{{cardInfo.config.base_info.brand_name}}</div>
		    <div class='title mgt10'>{{cardInfo.config.base_info.title}}</div>
		    <div class='info light' > {{cardInfo.time_limit_str}} </div>
		    <div class="">
		    	   <a  class="btn btn2" @click="useCard(cardInfo.code,cardInfo.config.base_info.title)">马上使用</a>
		    </div>
		   
		     <div class='info light'>{{cardInfo.config.base_info.description}}</div>    
	</div>
</section>

 <a  class="btn btn2 w100 bfix" @click="goBack">取消</a>
</div>

</div>
